.page-background {
    height: 100%;
    width: 100%;
    background: #ffffff;
}
.credit_card_payment_homepage {
    &__record {
        padding-top: 0.26rem;
        width: 100%;
        background: #ffffff;
        &-title {
            font-size: 0.32rem;
            color: #333333;
            margin-left: 0.32rem;
            margin-bottom: 0.26rem;
        }
        &-item {
            width: 100%;
            height: 1.4rem;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 0.32rem;
            box-sizing: border-box;
            position: relative;
            &-content {
                display: flex;
                align-items: center;
            }
            &-img {
                width: 0.48rem;
                height: 0.48rem;
            }
            &-arrow {
                width: 0.11rem;
                height: 0.2rem;
            }
            &-detail {
                margin-left: 0.16rem;
                display: flex;
                flex-direction: column;
            }
            &-p1 {
                font-size: 0.32rem;
                color: #333333;
            }
            &-p2 {
                font-size: 0.24rem;
                color: #999999;
                margin-top: 0.08rem;
            }
            // &:last-child {
            //     border-bottom: 0.01rem solid #e5e5e5;
            // }
            &::after {
                position: absolute;
                display: block;
                top: 100%;
                left: 0;
                right: 0;
                height: 1px;
                border-top: 1px solid #e5e5e5;
                z-index: 1;
                transform: scaleY(0.5);
                content: ' ';
            }
        }
        &-more {
            height: 0.58rem;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 0.28rem;
            color: #666666;
            border-top: 0.01rem solid #e5e5e5;
            margin-bottom: 0.3rem;
        }
    }
}

.ynet-radio {
    .ynet-radio__title {
      font-size: 0.28rem;
      line-height: 0.34rem;
      color: #999999;
      padding: 0.14rem 0 0.14rem 0.32rem;
    }
    .ynet-radio__content {
      display: inline-block;
      width: 100%;
      height: 0.98rem;
      font-size: 0;
      position: relative;
      &::after {
        position: absolute;
        display: block;
        top: 100%;
        left: 0;
        right: 0;
        height: 1px;
        border-top: 1px solid #e5e5e5;
        z-index: 1;
        transform: scaleY(0.5);
        content: " ";
      }
      &:last-child {
        &::after {
          display: none;
        }
      }
    }
    .ynet-radio__content__text {
      font-size: 0.22rem;
      line-height: 0.42rem;
      background-color: white;
      color: #333333;
      padding: 0.28rem 0.44rem 0.28rem 0.32rem;
      position: relative;
    }
    .ynet-radio-template2__content__input--checked {
      .normal {
        position: absolute;
        left: 10%;
        top: 55%;
        margin-top: -0.17rem;
        width: 2.3rem;
        height: 2.3rem;
        transform: scale(0.1);
        transform-origin: 0 0;
        background: url("~@assets/icon/radio.png") center center no-repeat;
        background-size: 100% 100%;
      }
    }
    .ynet-radio__content__input:checked + .ynet-radio-template2__content__input--checked {
      .normal {
        background: url("~@assets/icon/radio_on.png") center center no-repeat;
        background-size: 100% 100%;
      }
    }
  
    // 模版1
    .ynet-radio__content__input:checked + .ynet-radio__content__input--checked {
      display: inline-block;
      vertical-align: middle;
      font-family: "weui";
      font-size: inherit;
      text-rendering: auto;
      -webkit-font-smoothing: antialiased;
      &::before {
        display: inline-block;
      }
      @include weui-icon-success-no-circle;
      color: #d7000f;
      font-size: 0.32rem;
      position: absolute;
      right: 0.44rem;
    }
    .add-left-space {
      position: relative;
      padding-left: 0.94rem;
    }
    .icon-duoxuan-weixuanzhuangtai {
      font-size: 0.38rem;
      color: #999999;
      position: absolute;
      left: 0.32rem;
    }
    .icon-duoxuan-yixuanzhuangtai {
      font-size: 0.38rem;
      color: #d7000f;
      position: absolute;
      left: 0.32rem;
    }
    .ynet-radio__content__input + .ynet-radio-template2__content__input--checked {
      .icon-duoxuan-weixuanzhuangtai {
        display: inline-block;
      }
      .icon-duoxuan-yixuanzhuangtai {
        display: none;
      }
    }
    .ynet-radio__content__input:checked + .ynet-radio-template2__content__input--checked {
      .icon-duoxuan-weixuanzhuangtai {
        display: none;
      }
      .icon-duoxuan-yixuanzhuangtai {
        display: inline-block;
      }
    }
  }
  
  // 新增T3 
  .ynet-radio__btn-skin {
    .ynet-radio__content {
      display: inline-block;
      margin-right: 0.2rem;
      margin-top: 0.2rem;
      width: 1.4rem;
      min-width: 1.4rem;
      height: 0.6rem;
      border-radius: 0.3rem;
      background: #e5e5e5;
      font-size: 0.26rem;
      text-align: center;
      color: #333333;
      &::after {
        border: none;
      }
      &:nth-child(2) {
        margin-left: 0.28rem;
      }
      &.checked {
        background: #d7000f;
        .ynet-radio__content__text {
          color: #ffffff;
        }
      }
    }
  
    .ynet-radio__content__text {
      padding: 0;
      background: none;
      line-height: 0.6rem;
    }
  }
  //新增T4
  .ynet-radio__flex {
      position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #ffffff;
  
    &::after {
      position: absolute;
      top: 100%;
      left: 0;
      right: 0;
      z-index: 2;
      content: " ";
      border-bottom: 1px solid #e5e5e5;
      transform: scaleY(0.5);
    }
    &:last-child {
      border-bottom: none;
    }
    .ynet-radio__content {
      padding-right: 0.14rem;
      width: auto;
      &::after {
        display: none;
      }
    }
    .icon-duoxuan-yixuanzhuangtai,
    .icon-duoxuan-weixuanzhuangtai {
      left: 0;
      top: 0.28rem;
    }
    .ynet-radio__content__text {
      padding-left: 0.7rem;
      padding-right: 0.14rem;
    }
  }

$small-arrow: url('');
.payment-cell{
    @include cell--mixin;

    &__title {
        display: inline-block;
        width: 50%;
        min-width: 2.8rem;
        max-width: 2.8rem;
    }


    .ynet-cell__value {
        min-height: 0.6rem;
        min-width: 3.5rem;
        flex: 1;
        -webkit-flex: 1;
        text-align: left;
        font-size: 0.24rem;
        line-height: 0.1rem;
        width: 50%;
    }
    .ynet-cell__value2 {
      min-height: 0.6rem;
      min-width: 3.5rem;
      flex: 1;
      -webkit-flex: 1;
      text-align: right;
      font-size: 0.24rem;
      width: 50%;
  }
    .multi-row {
        display: inline-block;
        padding: 0.1rem 0;
        line-height: 0.44rem;
        text-align: left;
        word-wrap: break-word;
        word-break: break-word;
        vertical-align: bottom;
    }

    .ynet-cell__arrow {
        position: relative;
        display: inline-block;
        width: 0.7rem;
        height: auto;

        &::after {
            position: absolute;
            right: 0.32rem;
            top: -0.1rem;
            display: block;
            width: 0.11rem;
            height: 0.2rem;
            content: '';
            background-size: cover;
            background-image: url('~@assets/icon/arrow.png');
        }
    }
}

.payment_homepage {
    &__menu_back {
        overflow: hidden;
        width: 7rem;
        height: 4.45rem;
        background: #ffffff;
        padding: 0.32rem;
        box-sizing: border-box;
    }
    &__menu {
        width: 6.86rem;
        height: 3.8rem;
        background: #ffffff;
        box-shadow: 0 0.04rem 0.1rem 0 rgba(0,0,0,0.20);
        border-radius: 0.08rem;
        //padding: 0 0.26rem;
        box-sizing: border-box;
        &-top {
            display: flex;
            justify-content: space-around;
            align-items: center;
            //border-bottom: 0.01rem solid #e5e5e5;
            height: 0.8rem;
            background-color: #f5f5f5;
            &-item {
                display: flex;
                //flex-direction: column;
                justify-content: center;
                align-items: center;
                width: 100%;
                img {
                    width: 0.5rem;
                    height: 0.4rem;
                    margin-left: 0%;
                }
                p {
                    font-size: 0.28rem;
                    color: #333333;
                    margin-left: 10%
                    //margin-top: 0.08rem;
                }
                span {
                    font-size: 0.28rem;
                    color: #356fc5;
                    margin-left: 30%
                    //margin-top: 0.08rem;
                }
            }
        }
    }
}

.div_top{
  display: flex;
  flex-direction:row;
  padding: 0.2rem;
  .item-left{
      width: 50%;
      display: flex;
      padding: 0.2rem;
      div{
          width: 100%;
          border: 0.01rem solid #DDE0E4;
          font-size: 13px;
          color: rgb(44, 46, 48);
          letter-spacing: 0;
          margin-left: 0.2rem;
          text-align:center;
          cursor: pointer;
      }
  }
  .item-right{
      width: 50%;
      display: flex;
      padding: 0.2rem;
      div{
          width: 100%;
          border: 0.01rem solid #DDE0E4;
          font-size: 13px;
          color: rgb(44, 46, 48);
          letter-spacing: 0;
          margin-right: 0.2rem;
          text-align:center;
          cursor: pointer;
      }
  }
}

  
  
  
